<!DOCTYPE html>
<html lang="en">
<head>
    <title>首页</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="bootstrap-4.2.1-dist/css/bootstrap.css"/>
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="css/partialviewslider.css">
    <link href="http://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
    <link href="css/layout.css" rel="stylesheet"/>
    <link href="css/menu.css" rel="stylesheet"/>
    <link rel="stylesheet" href="css/circle.css">
    <link href="css/css.css" rel="stylesheet"/>
    <link href="css/newChina.css" rel="stylesheet"/>
    <link rel="stylesheet" href="css/xuesishi.css"/>
    <link rel="stylesheet" href="history/history.css"/>
    <link rel="stylesheet" href="css/style.css"/>
    <link rel="stylesheet" href="css/reform.css"/>
    <link rel="stylesheet" href="css/socialism.css"/>
    <script src="js/jquery-3.5.1.js"></script>
    <script src="bootstrap-4.2.1-dist/js/bootstrap.js"></script>
    <script src="js/jquery.min.js"></script>
    <script src="js/js.js"></script>
    <script src="js/circle.js"></script>
    <script src="history/imgSlider.js"></script>
    <script src="js/banner.js"></script>
    <link rel="stylesheet" href="css/swiper.min.css">
    <!--    <script src="js/jquery-1.11.3.min.js"></script>-->
    <script src="js/swiper.min.js"></script>
    <script src="js/jquery.waypoints.min.js"></script>
    <style>
        html, body {
            width: 100%;
            height: 100%;
        }

        .goto_top {
            position: fixed;
            bottom: 50px;
            right: 30px;
            opacity: 1;
            background: #DBDEE1;
            padding: 5px 0;
        }

        .box {
            height: 300px;
            width: 80%;
            margin: 0 auto;
            position: relative;
        }

        .box:hover {
            transform: scale(1.05);
        }

        .imgbox img {
            height: 300px;
            width: 100%;
        }
    </style>
</head>
<body>
<!--江西师范大学图标-->
<div id="top" class="row justify-content-center">
    <div class="col  d-flex">
        <div class="m-auto">
            <img src="img/logo.png" alt="logo"/>
        </div>
    </div>
    <div class="col  d-flex">
        <div class="m-auto">
            <img src="img/jsnd.png" alt="jsnd"/>
        </div>
    </div>
</div>
<!--导航栏-->
<ul id="nav" class="row justify-content-around">
    <li class="col-2"><a href="index.html" class="py-4">首页</a></li>
    <li class="col-2"><a href="#xuesishi" class="py-4">学四史</a>
        <ul class="subs">
            <li><a href="#dangshi">党史</a></li>
            <li><a href="#xinzhongguo">新中国史</a></li>
            <li><a href="#gaige">改革开放史</a></li>
            <li><a href="#shehui">社会主义发展史</a></li>
        </ul>
    </li>
    <li class="col-2">
        <a href="#chuxin" class="py-4">铭初心</a>
        <ul class="subs">
            <li><a href="#chuxin">不忘初心</a></li>
            <li><a href="#chuxin">牢记使命</a></li>
            <li><a href="#changzheng">长征精神</a></li>
        </ul>
    </li>
    <li class="col-2">
        <a href="#xiaoqing" class="py-4">庆八秩芳华</a>
        <ul class="subs">
            <li><a href="#xiaoqing">80周年校庆</a></li>
        </ul>
    </li>
</ul>
<!--轮播图-->
<div class="banner1 box">
    <div class="imgbox">
        <img src="img/师大.jpg" alt="师大">
        <img src="img/国庆.jpg" alt="国庆">
        <img src="img/两会精神.jpg" alt="两会精神">
    </div>
</div>
<!--回到顶部-->
<div class="goto_top">
    <span>
        <a href="#top">
            <img src="img/顶部.png" alt="顶部">
        </a>
    </span>
</div>
<!--长征精神图标-->
<div id="changzheng" class="row no-gutters mt-5">
    <div class="row  justify-content-center ico-bg">
        <p class="text-center m-auto col ">
            <img src="img/党徽.png" alt="党徽"/>
        </p>
        <div class="text-center m-auto col ">
            <p class="m-auto " style="width: 300px;text-align:center;font-family: 华文新魏,sans-serif;font-size: 32px;">
                长征精神 永放光芒
            </p>
        </div>
    </div>
</div>
<!--长征精神轮播图-->
<div id="zSlider">
    <div id="picshow">
        <div id="picshow_img">
            <ul>
                <li><a href="#"><img src="img/过草地.jpg" alt="过草地"></a></li>
                <li><a href="#"><img src="img/雪山.jpg" alt="雪山"></a></li>
                <li><a href="#"><img src="img/七律长征.jpg"></a></li>
                <li><a href="#"><img src="img/遵义会议.jpg"></a></li>
                <li><a href="#"><img src="img/二万五.png"></a></li>
                <li><a href="#"><img src="img/长征起因.jpg"></a></li>
            </ul>
        </div>
        <div id="picshow_tx">
            <ul>
                <li>
                    <h3><a href="#">红军过草地</a></h3>
                    <p>1935年8月21日，红军开始过草地。行军队左右两路，平行前进。茫茫草地，一望无涯，遍地是水草沼泽泥潭，根本没有路。人和马必须踏着草甸走，从一个草甸跨到另一个草甸跳跃前进。</p>
                </li>
                <li>
                    <h3><a href="#">红军过雪山</a></h3>
                    <p>红军过雪山，是红军长征中最艰苦的行军之一红军翻越的雪山，大都海拔4000米以上，空气稀薄，人迹罕至，白雪皑皑，山高谷深，气候变幻无常。</p>
                </li>
                <li>
                    <h3><a href="#">七律长征</a></h3>
                    <p>红军不怕远征难，万水千山只等闲。五岭逶迤腾细浪，乌蒙磅礴走泥丸。金沙水拍云崖暖，大渡桥横铁索寒。 更喜岷山千里雪，三军过后尽开颜。</p>
                </li>
                <li>
                    <h3><a href="#">遵义会议</a></h3>
                    <p>遵义会议是指1935年1月中共中央政治局在贵州遵义召开的独立自主地解决中国革命问题的一次极其重要的扩大会议。</p>
                </li>
                <li>
                    <h3><a href="#">“二万五”的由来</a></h3>
                    <p>长征始于1934年10月红一方面军撤出江西瑞金，结束于1936年10月红军三大主力会师。人们经常把长征称为二万五千里长征，这个长度是怎么确定的呢？</p>
                </li>
                <li>
                    <h3><a href="#">长征起因</a></h3>
                    <p>1934年10月，第五次反“围剿”失败后，中央主力红军为摆脱国民党军队的包围追击，被迫实行战略性转移，退出中央根据地，进行长征。</p>
                </li>
            </ul>
        </div>
    </div>
    <div id="select_btn">
        <ul>
            <li><a href="#"><img src="img/过草地.jpg"><span class="select_text">红军过草地</span><span
                    class="select_date">1935年8月21日</span></a></li>
            <li><a href="#"><img src="img/雪山.jpg"><span class="select_text">红军过雪山</span><span
                    class="select_date">1935年6月</span></a></li>
            <li><a href="#"><img src="img/七律长征.jpg"><span class="select_text">七律长征</span><span
                    class="select_date">1935年10月</span></a></li>
            <li><a href="#"><img src="img/遵义会议.jpg"><span class="select_text">遵义会议</span><span
                    class="select_date">1935年1月15日</span></a></li>
            <li><a href="#"><img src="img/二万五.png"><span class="select_text">“二万五”的由来</span><span
                    class="select_date">1934年10月</span></a></li>
            <li><a href="#"><img src="img/长征起因.jpg"><span class="select_text">长征起因</span><span
                    class="select_date">1934年10月</span></a></li>
        </ul>
    </div>
</div>
<!--学四史图标-->
<div id="xuesishi" class="row no-gutters ">
    <div class="row m-auto justify-content-center ico-bg">
        <div class="text-center m-auto">
            <img src="img/党徽.png" alt="党徽" class="ml-5"/>
        </div>
        <div class="text-center m-auto">
            <p class="m-auto" style="width: 300px;text-align:center;font-family: 华文新魏,sans-serif;font-size: 35px;">
                学 四 史
            </p>
        </div>
    </div>
</div>
<!--学四史内容-->
<div class="container-fluid">
    <!--学四史背景图片-->
    <div class="row mt-5">
        <p class="m-auto">
            <img src="img/学.png" alt="学四史背景图片" style="display: block;width: 1200px;">
        </p>
    </div>
    <!--学四史导航栏-->
    <ul class="row justify-content-center m-auto xuesishi-ul">
        <li class="col-2 text-center align-self-end"><a id="dangshi" href="" class="xuesishinav_a">党史</a></li>
        <li class="col-2 text-center align-self-end"><a id="xinzhongguo" href="" class="xuesishinav_a">新中国史</a></li>
        <li class="col-2 text-center align-self-end"><a id="gaige" href="" class="xuesishinav_a">改革开放史</a></li>
        <li class="col-2 text-center align-self-end"><a id="shehui" href="" class="xuesishinav_a">社会主义发展史</a></li>
    </ul>
    <!--学四史导航栏隐藏内容-->
    <!--党史-->
    <div class="xl-box  m-auto justify-content-center border border-danger border-top-0">
        <!--        <div class="row no-gutters justify-content-around">-->
        <!--            <div class="border border-secondary col-2 dangshi">-->
        <!--                111-->
        <!--            </div>-->
        <!--            <div class="border border-secondary col-2 dangshi">-->
        <!--                111-->
        <!--            </div>-->
        <!--            <div class="border border-secondary col-2 dangshi">-->
        <!--                111-->
        <!--            </div>-->
        <!--            <div class="border border-secondary col-2 dangshi">-->
        <!--                111-->
        <!--            </div>-->
        <!--            <div class="border border-secondary col-2 dangshi">-->
        <!--                111-->
        <!--            </div>-->
        <!--        </div>-->
        <!--        <div class="row no-gutters justify-content-around">-->
        <!--            <div class="border border-secondary col-2 dangshi">-->
        <!--                111-->
        <!--            </div>-->
        <!--            <div class="border border-secondary col-2 dangshi">-->
        <!--                111-->
        <!--            </div>-->
        <!--            <div class="border border-secondary col-2 dangshi">-->
        <!--                111-->
        <!--            </div>-->
        <!--            <div class="border border-secondary col-2 dangshi">-->
        <!--                111-->
        <!--            </div>-->
        <!--            <div class="border border-secondary col-2 dangshi">-->
        <!--                111-->
        <!--            </div>-->
        <!--        </div>-->
        <!--        <div class="row no-gutters justify-content-around">-->
        <!--            <div class="border border-secondary col-2 dangshi">-->
        <!--                111-->
        <!--            </div>-->
        <!--            <div class="border border-secondary col-2 dangshi">-->
        <!--                111-->
        <!--            </div>-->
        <!--            <div class="border border-secondary col-2 dangshi">-->
        <!--                111-->
        <!--            </div>-->
        <!--            <div class="border border-secondary col-2 dangshi">-->
        <!--                111-->
        <!--            </div>-->
        <!--            <div class="border border-secondary col-2 dangshi">-->
        <!--                111-->
        <!--            </div>-->
        <!--        </div>-->
        <!--党史-->
        <div id="history">
            <div id="jdjxc">
                <div id="imgRolling">
                    <ul class="imagebg" id="imagebg">
                        <li data-spic="history/images/small-1.jpg">
                            <img src="history/img/big-1.jpg"/>
                        </li>
                        <li data-spic="history/images/small-2.jpg">
                            <img src="history/img/big-2.jpg"/>
                        </li>
                        <li data-spic="history/images/small-3.jpg">
                            <img src="history/img/big-3.jpg"/>
                        </li>
                        <li data-spic="history/images/small-4.jpg">
                            <img src="history/img/big-4.jpg"/>
                        </li>
                        <li data-spic="history/images/small-5.jpg">
                            <img src="history/img/big-5.jpg"/>
                        </li>
                        <li data-spic="history/images/small-6.jpg">
                            <img src="history/img/big-6.jpg"/>
                        </li>
                        <li data-spic="history/images/small-7.jpg">
                            <img src="history/img/big-7.jpg"/>
                        </li>
                        <li data-spic="history/images/small-8.jpg">
                            <img src="history/img/big-8.jpg"/>
                        </li>
                        <li data-spic="history/images/small-9.jpg">
                            <img src="history/img/big-9.jpg"/>
                        </li>
                    </ul>
                    <div class="scrollbg">
                        <div class="scroll">
                            <a id="left_btn" class="pre" href="javascript:void(0)"></a>
                            <div class="present" id="present"></div>
                            <div class="outScroll_pic">
                                <ul class="scroll_img cls" id="small_pic"></ul>
                            </div>
                            <a id="right_btn" class="next" href="javascript:void(0)"></a>
                        </div>
                    </div>
                </div>
                <script type="text/javascript" src="history/imgSlider.js"></script>
            </div>
        </div>
    </div>
    <!--新中国史-->
    <div class="xl-box scroll overflow-auto m-auto" id="newChina">
        <header class="site-header">
            <div class="wrapper">
                <h1 class="site-header__title">中华人民共和国历史之窗</h1>
            </div>
        </header>

        <section class="timeline">
            <div class="wrapper">

                <div class="timeline__item timeline__item--1">
                    <div class="timeline__item__station"></div>
                    <div class="timeline__item__content">
                        <h2 class="timeline__item__content__date">1 新中国成立</h2>
                        <p class="timeline__item__content__description">1949年9月21日至9月30日，第一届中国人民政治协商会议全体会议在北平召开。9月29日，会议通过具有临时宪法性质的《中国人民政治协商会议共同纲领》
                            ，政协代行全国人民代表大会的职权。1949年10月1日，在北京天安门广场举行开国大典，毛泽东在天安门城楼上宣告中华人民共和国中央人民政府成立，中华人民共和国正式成立。</p>
                    </div>
                </div>
                <div class="timeline__item timeline__item--2">
                    <div class="timeline__item__station"></div>
                    <div class="timeline__item__content">
                        <h2 class="timeline__item__content__date">2 巩固政权</h2>
                        <p class="timeline__item__content__description">新中国成立后的头三年，肃清了国民党在大陆的残余武装力量和土匪，实现了西藏的和平解放，建立了各地各级的人民政府，
                            没收了官僚资企业并把它们改造成为社会主义国营企业，统一了中国财政经济工作，稳定了物价，完成了新解放区土地制度的改革，镇压了反革命，开展了反贪污、反浪费、反官僚主义的“三反”运动
                            ，开展了打退资产阶级进攻的反行贿、反偷税漏税、反盗骗国家财产、反偷工减料、反盗窃国家经济情报的“五反”运动。对旧中国的教育科学文化事业，进行了很有成效的改造。
                            <br></br>在完成繁重的社会改革任务和进行抗美援朝、保家卫国战争的同时，迅速恢复了在旧中国遭到严重破坏的国民经济，中国工农业生产1952年底已经达到历史的最高水平。</p>
                    </div>
                </div>
                <div class="timeline__item timeline__item--3">
                    <div class="timeline__item__station"></div>
                    <div class="timeline__item__content">
                        <h2 class="timeline__item__content__date">3 过渡时期</h2>
                        <p class="timeline__item__content__description">从1949年10月中华人民共和国成立到1956年，中国有步骤地实现从新民主主义到社会主义的转变，迅速恢复了国民经济并开展了有计划的经济建设，在中国绝大部分地区基本上完成了
                            对生产资料私有制的社会主义改造。在这个历史阶段中，中共确定的指导方针和基本政策是正确的。</p>
                    </div>
                </div>
                <div class="timeline__item timeline__item--4">
                    <div class="timeline__item__station"></div>
                    <div class="timeline__item__content">
                        <h2 class="timeline__item__content__date">4 社会主义探索时期</h2>
                        <p class="timeline__item__content__description">社会主义改造基本完成以后，中国开始转入全面的大规模的社会主义建设。 <br></br>
                            直到“文化大革命”前夕的10年中，虽然遭到过严重挫折，仍然取得了很大的成就。以1966年同1956年相比，中国工业固定资产按原价计算，增长了3倍。棉纱、原煤、发电量、原油、钢和机械设备等主要工业产品的产量，都有巨大的增长。
                            中国赖以进行现代化建设的物质技术基础，很大一部分是这个期间建设起来的；中国经济文化建设等方面的骨干力量和他们的工作经验，大部分也是在这个期间培养和积累起来的。</p>
                    </div>
                </div>
                <div class="timeline__item timeline__item--5">
                    <div class="timeline__item__station"></div>
                    <div class="timeline__item__content">
                        <h2 class="timeline__item__content__date">5 文革时期</h2>
                        <p class="timeline__item__content__description">1966年5月至1976年10月的“文化大革命”，使中国遭到建国以来最严重的挫折和损失。 <br></br>
                            1966年中旬毛泽东认为：一大批资产阶级的代表人物、反革命的修正主义分子，已经混进党里、政府里、军队里和文化领域的各界里，相当大的一个多数的单位的领导权已经不在马克思主义者和人民群众手里。
                            过去的各种斗争都不能解决问题，只有实行文化大革命，公开地、全面地、自下而上地发动广大群众来揭发上述的黑暗面，才能把被走资派篡夺的权力重新夺回来。
                            <br></br>这些论点主要地出现在作为“文化大革命”纲领性文件的《五·一六通知》和中共“九大”的政治报告中。“文化大革命”的历史，证明毛泽东发动“文化大革命”的
                            主要论点既不符合马克思列宁主义，也不符合中国实际。这些论点对当时中国阶级形势以及党和国家政治状况的估计，是完全错误的。</p>
                    </div>
                </div>
                <div class="timeline__item timeline__item--6">
                    <div class="timeline__item__station"></div>
                    <div class="timeline__item__content">
                        <h2 class="timeline__item__content__date">6 真理大讨论</h2>
                        <p class="timeline__item__content__description">粉碎“四人帮”的胜利从危难中挽救了中国，但“文化大革命”遗留下来的政治、思想、组织和经济上的混乱还极其严重。
                            <br></br>1978年12月召开的中共十一届三中全会和全会形成的以邓小平为核心的第二代中央领导集体（中国共产党第一代领导集体以毛泽东为核心，邓小平是其重要成员）
                            ，承担起艰巨的使命，实现了伟大的历史性转折，开创了中国社会主义事业发展的新时期。</p>
                    </div>
                </div>
                <div class="timeline__item timeline__item--7">
                    <div class="timeline__item__station"></div>
                    <div class="timeline__item__content">
                        <h2 class="timeline__item__content__date">7 改革开放</h2>
                        <p class="timeline__item__content__description">中共十一届三中全会选出以邓小平为核心的第二代中央领导集体。这个时期可以说是中国飞速发展的起点，比较主要的事件主要有以下几个：
                            实行家庭联产承包责任制，废除人民公社，创建深圳、珠海、汕头、厦门4个经济特区，并提出“一国两制”方案。
                            中国在这个时间段经历了一个加速发展的飞跃时期，展现了农业和工业、农村和城市、改革和发展相互促进的生动局面，整个国民经济提高到一个新的水平。</p>
                    </div>
                </div>
                <div class="timeline__item timeline__item--8">
                    <div class="timeline__item__station"></div>
                    <div class="timeline__item__content">
                        <h2 class="timeline__item__content__date">8 第三代领导集体时期</h2>
                        <p class="timeline__item__content__description">中共十三届四中全会选出新的中央领导集体。经过四中全会、五中全会，以邓小平为核心的第二代中央领导集体和以江泽民为核心的第三代中央领导集体有计划、
                            有步骤地实现了顺利的交接。中共中央全面坚持党的基本路线，继续抓住经济建设这个中心，努力纠正“一手比较硬，一手比较软”的现象，加强思想政治工作和党的建设工作。
                            <br></br>
                            在国际局势剧变的情况下，中国共产党按照冷静观察、沉着应付的方针，坚持把注意力集中在办好自己的事情上，相继作出关于加强廉政建设的决定，关于进一步治理整顿、深化改革的决定，
                            关于加强党同人民群众联系的决定，关于上海浦东开发开放的决策，关于国民经济和社会发展十年规划和“八五”计划的建议，关于搞好国营大中型企业的决定，关于进一步加强农业和农村工作的决定。中国共产党在历史关键时刻作出的这些重大决策，是完全正确的。</p>
                    </div>
                </div>
                <div class="timeline__item timeline__item--9">
                    <div class="timeline__item__station"></div>
                    <div class="timeline__item__content">
                        <h2 class="timeline__item__content__date">9 第四代领导集体时期</h2>
                        <p class="timeline__item__content__description">2002年11月中国共产党第十六次全国代表大会在北京召开。大会的主题是：高举邓小平理论伟大旗帜，全面贯彻“三个代表”重要思想，继往开来，与时俱进，全面建设小康社会，加快推进社会主义现代化，为开创中国特色社会主义事业新局面而奋斗。
                            <br></br>大会对中共的十五届以来的五年工作和十三届四中全会以来十三年伟大实践
                            的基本经验进行了科学的、全面的总结；为全面建设小康社会，开创中国特色社会主义事业新局面，对中国经济、政治、文化建设和改革等各方面的工作进行了全面部署</p>
                    </div>
                </div>
                <div class="timeline__item timeline__item--10">
                    <div class="timeline__item__station"></div>
                    <div class="timeline__item__content">
                        <h2 class="timeline__item__content__date">10 伟大中国梦</h2>
                        <p class="timeline__item__content__description">2012年11月，在中国共产党十八届一中全会上，习近平当选中共中央总书记。 2013年3月23日，国家主席习近平在莫斯科国际关系学院发表演讲。
                            <br></br>实现中华民族伟大复兴，是近代以来中国人民最伟大的梦想，我们称之为“中国梦”，基本内涵是实现国家富强、民族振兴、人民幸福。
                            到2020年国内生产总值和城乡居民人均收入在2010年的基础上翻一番，全面建成小康社会；到本世纪中叶建成富强民主文明和谐的社会主义现代化国家，实现中华民族伟大复兴的中国梦。</p>
                    </div>
                </div>
            </div>
        </section>
    </div>
    <!--改革开放史-->
    <div class="xl-box m-auto" id="reform">
        <h2 align="center">改革开放形成过程</h2>
        <div class="container-reform">
            <div class="card-container-2" id="card-container-2">
                <div class="controller right" onclick="fun1()"></div>
                <div class="controller left" onclick="fun2()"></div>
                <div class="card-holder" id="holder">
                    <div class="card">
                        <h1>1 改革开始</h1>
                        <p>1978年以前的安徽省凤阳县小岗村，
                            是全县有名的“吃粮靠返销，用钱靠救济、生产靠贷款”的“三靠村”，
                            每年秋收后几乎家家外出讨饭。1978年11月24日，小岗村18户农民以敢为天下先的胆识，
                            按下了18个手印，搞起生产责任制，揭开了中国农村改革的序幕。<br></br>
                            也许是历史的巧合——就在这些农民按下手印的不久，
                            中共第十一届三中全会在北京人民大会堂隆重开幕。在关系国家命运和前途的严峻历史关头，
                            以邓小平为代表的中国最高层的政治家和最底层的农民们，共同翻开了历史新的一页。小岗村从而成为中国农村改革的发源地。</p>
                    </div>
                    <div class="card">
                        <h1>2 形成思想</h1>
                        <p>1978年5月11日，《光明日报》头版发表特约评论员文章《实践是检验真理的唯一标准》，在全国范围内引发了一场关于真理标准问题的大讨论。
                            <br></br>
                            在邓小平等老一辈无产阶级革命家的领导和支持下，依靠理论界、新闻界和从事实际工作同志的紧密配合，这场讨论终于冲破“两个凡是”的束缚，
                            为党的十一届三中全会重新确立马克思主义的思想路线作了理论和舆论上的准备，在党和国家的历史进程中产生了重大而深远的影响</p>
                    </div>
                    <div class="card">
                        <h1>3 政策形成</h1>
                        <p>1978年，党的十一届三中全会作出了实行改革开放的重大决策。
                            1979年，党中央、国务院批准广东、福建在对外经济活动中实行“特殊政策、灵活措施”，并决定在深圳、珠海、厦门、汕头试办经济特区，
                            福建省和广东省成为全国最早实行对外开放的省份之一。
                            </br>1988年4月13日在第七届全国人民代表大会上通过关于建立海南省经济特区的决议，
                            建立了海南经济特区。深圳等经济特区的创建成功，为进一步扩大开放积累了经验，有力推动了中国改革开放和现代化的进程。
                            1990年，党中央和国务院从中国经济发展的长远战略着眼，又做出了开发与开放上海浦东新区的决定。中国的对外开放出现了一个新局面。</p>
                    </div>
                    <div class="card">
                        <h1>4 开放格局</h1>
                        <p>中国的对外开放已从沿海向内地发展，形成经济特区——沿海开放城市——沿海经济开放区——内地，这样一个全方位、多层次、宽领域的对外开放格局。
                            </br>1．全方位： 我国的对外开放是对世界所有类型的国家开放，不仅对发达国家，而且也对发展中国家，对原苏联东欧地区的国家开放。
                            </br>
                            2．多层次： 我国的对外开放经历了由东到西、由点到线、由线到面，由沿海到内地逐步推进的过程，形成了全国性的对外开放格局。
                            </br>
                            3．多渠道、宽领域： 就是向世界市场开放，包括商品市场、资本市场、技术市场、劳务市场等。</br>
                            4．加入世贸组织，标志着我国对外开放进入了一个新的阶段。

                        </p>
                    </div>
                    <div class="card">
                        <h1>5 十个结合</h1>
                        <p>改革开放以来，我们党和国家在取得社会主义现代化建设举世瞩目成就的同时，创造和积累了丰富的实践经验。<br></br>
                            在党的十三大、十四大、十五大、十六大分别作出改革开放阶段性经验总结的基础上，
                            党的十七大从总结近30年改革开放整个历史进程着眼，紧扣在一个十几亿人口的发展中大国如何才能摆脱贫困、
                            加快实现现代化、巩固和发展社会主义的问题，全方位、大力度地总结概括出“十个结合”的宝贵经验。</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--社会主义发展史-->
    <div class="xl-box overflow-auto m-auto px-5" id="socialism">
        <div class="socialBox px-5">
        <h1 align="center" class="my-4">社会主义发展史</h1>
        <p style="text-indent: 2em;">
            社会主义从提出到现在，已经走过了500多年的发展历程。只有把党史、新中国史、改革开放史和社会主义发展史联系起来，才能更好地弄清楚我们从哪里来、现在到了哪里、今后要往哪里去，从而不断深化对“不忘初心、牢记使命”的理性认识，坚定对社会主义和共产主义的理想信念。</p>
        <p style="text-indent: 2em;">
            <strong>从无到有的思想先声</strong></p>
        <p style="text-indent: 2em;">
            社会主义思想不是从来就有的，而是伴随着资本主义产生而产生的。15—16世纪，随着航海业的发展和美洲新大陆的发现，资本主义在欧洲尤其是在英国得到迅速发展，社会主义思想也最早产生在英国。1516年，托马斯·莫尔发表《乌托邦》一书，标志着空想社会主义的诞生。该书用著名的“羊吃人”的命题，最早揭露和批判了资本原始积累的罪恶，描绘了一个没有剥削压迫、人人平等的理想王国。这一时期的空想社会主义者还有德国的闵采尔、意大利的康帕内拉等，他们以极为虚幻的形式展露出共产主义思想的微光。随着资本主义的不断发展，空想社会主义也在不断完善，到19世纪上半叶，空想社会主义达到其思想最高峰，这就是圣西门、傅立叶和欧文三大空想社会主义者的空想社会主义思想。他们无情揭露了资本主义社会固有的矛盾和弊病，论证了社会主义代替资本主义的合理性，提出了关于未来社会的一些积极主张和天才预测，为科学社会主义提供了重要的思想材料。但是，由于受不成熟的资本主义发展状况和唯心史观的局限，空想社会主义无法找到实现其社会理想的正确道路和社会力量，因而具有“十分虚幻和空想的性质”。</p>
        <p style="text-indent: 2em;">
            <strong>从空想到科学的飞跃</strong></p>
        <p style="text-indent: 2em;">
            19世纪中叶，资本主义社会化大生产不断发展，工人阶级作为独立政治力量登上历史舞台。马克思、恩格斯深入考察资本主义社会状况，批判继承德国古典哲学、英国古典政治经济学和英法空想社会主义等一系列人类文明成果，创立唯物史观和剩余价值学说，揭示了社会主义代替资本主义的客观规律，使社会主义代替资本主义不再是人们头脑中的一种主观愿望，而成为现实社会矛盾运动的必然趋势。唯物史观和剩余价值学说这“两大发现”，使社会主义建立在现实的基础之上，实现了从空想到科学的伟大飞跃。科学社会主义理论犹如壮丽的日出，照亮了人类探索历史规律和寻求自身解放的道路。在马克思主义指导下，“第一国际”等国际工人组织相继创立和发展，工人阶级政党如雨后春笋般建立和发展，国际共产主义运动蓬勃兴起和发展，人民第一次成为自己命运的主人，成为实现自身解放和人类解放的根本政治力量。然而，马克思、恩格斯时代的科学社会主义主要是理论上的，至于如何把科学社会主义理论变成社会主义社会的现实实践，还有待后来者来解答。</p>
        <p style="text-indent: 2em;">
            <strong>从理论到现实的转变</strong></p>
        <p style="text-indent: 2em;">
            19世纪末20世纪初，资本主义过渡到帝国主义阶段，资本主义的不平衡矛盾日益激化，经济文化相对落后的俄国逐渐成为资本主义各种矛盾的集合点和帝国主义链条上的“薄弱环节”。科学社会主义发展的中心逐步从西欧转移到俄国。列宁在革命的实践中，坚持把马克思主义同俄国具体实际相结合，创造性地提出社会主义可能在一国或数国首先取得胜利的理论，领导十月革命取得成功，建立了世界上第一个社会主义国家，实现了社会主义从理论到实践的历史转变。十月革命为世界其他各国无产阶级树立了榜样，推动共产党在世界各国普遍建立和国际共产主义运动蓬勃高涨。列宁领导俄国党和人民在帝国主义的包围中探索社会主义建设道路，取得初步进展并积累了宝贵经验。列宁指出，根据书本争论社会主义纲领的时代已经结束，今后只能根据人民群众生气勃勃的实践来谈论和建设社会主义了。列宁去世后，斯大林领导苏联人民开展了大规模的社会主义建设并取得了巨大成就。但是，苏联在社会主义建设中逐步形成了一个以高度集中的经济政治体制为特征的“苏联模式”，并日益成为经济社会发展的体制障碍。</p>
        <p style="text-indent: 2em;">
            <strong>从一国到多国的发展</strong></p>
        <p style="text-indent: 2em;">
            第一次世界大战结束后，帝国主义所固有的各种矛盾一个也未能解决。1929年爆发的资本主义经济危机，进一步激化了帝国主义各国之间的矛盾，并导致了第二次世界大战爆发。联共（布）领导苏联人民进行了伟大的卫国战争，其他欧洲各国人民在共产党领导下开展了各种形式的反法西斯斗争，中国共产党和亚洲许多国家的共产党，领导和参与了本国人民抗击日本侵略者的斗争，为世界反法西斯战争胜利作出重要贡献。1945年5月，苏联红军攻克柏林，把红旗插上了德国国会大厦。在苏联的帮助下，南斯拉夫、阿尔巴尼亚、波兰、捷克斯洛伐克、匈牙利、罗马尼亚、保加利亚和民主德国等在二战结束后建立人民民主政权，成为社会主义国家。亚洲的中国、越南、朝鲜、蒙古以及美洲的古巴等国二战后也先后走上了社会主义发展道路。这样，社会主义建设就越出一个国家的范围，实现了从一国到多国的发展，特别是中国这样一个占人类四分之一人口的世界大国走上社会主义道路，极大地壮大了社会主义的力量，极大地改变了世界政治格局，对人类社会的发展走向产生了极其深远的影响。</p>
        <p style="text-indent: 2em;">
            <strong>从中国创造到世界旗帜</strong></p>
        <p style="text-indent: 2em;">
            在中国这样一个经济文化落后的东方大国如何建设社会主义，是我们党执政后面临的一个崭新课题。我们党较早认识到苏联模式存在的问题，提出要独立自主探索出适合自己国情的社会主义建设道路。在这一探索过程中，我们既取得了巨大成就，获得了宝贵经验，也历尽艰辛，遭受严重挫折，甚至发生了“文化大革命”这样的全局性的错误。党的十一届三中全会后，我们党总结社会主义建设正反两方面的经验，作出了实行改革开放的历史性决策，成功开创了中国特色社会主义。改革开放40多年来，我们党经受住苏联解体、东欧剧变带来的严重冲击和其他各种风险考验，带领人民成功坚持和发展了中国特色社会主义。经过长期努力，中国特色社会主义进入新时代，中华民族迎来了从站起来、富起来到强起来的伟大飞跃，迎来了实现中华民族伟大复兴的光明前景。社会主义是人类发展的必然趋势，不仅没有灭亡，也不会灭亡，而且焕发出强大生机活力。中国特色社会主义的成功，用事实宣告了“历史终结论”的终结，彻底荡涤了苏联解体、东欧剧变给社会主义发展带来的阴霾，重振了人们对社会主义的信心，使世界范围内两种意识形态、两种社会制度的历史演进及其较量，发生了有利于马克思主义、社会主义的深刻转变。中国特色社会主义既是中国的，也是世界的。中国共产党和中国人民以自己的伟大创造，成为世界社会主义的中流砥柱和引领21世纪社会主义发展的伟大旗帜。当到本世纪中叶，我国成为世界上第一个通过走社会主义道路成功建成现代化强国之时，中国特色社会主义将展现出更加强大、更有说服力的真理力量，对于人类社会发展进步的历史作用将更加充分地展现出来。</p>
        <p style="text-indent: 2em;">
            来源：文汇报</p>
        </div>
    </div>
</div>
<!--铭初心图标-->
<div id="chuxin" class="row no-gutters">
    <div class="row justify-content-center ico-bg mt-5 mb-5">
        <div class="text-center m-auto">
            <img src="img/党徽.png" alt="党徽" class="ml-5"/>
        </div>
        <div class="text-center m-auto">
            <p class="m-auto" style="width: 300px;text-align:center;font-family: 华文新魏,sans-serif;font-size: 35px;">
                铭 初 心
            </p>
        </div>
    </div>
</div>
<!--铭初心内容-->
<div class="container-fluid">
    <div class="m-auto" style="width: 1200px;">
        <!--不忘初心背景图片-->
        <div class="row">
            <p class="m-auto">
                <img src="img/不忘初心.jpg" alt="不忘初心" style="display: block;width: 1200px;">
            </p>
        </div>
        <div class="row">
            <!--不忘初心轮播图-->
            <div class="slider">
                <input type="radio" name="slide_switch" id="id1"/>
                <label for="id1">
                    <img src="img/不忘2.jpg" alt="不忘2"/>
                </label>
                <img src="img/不忘2.jpg" alt="不忘2"/>
                <input type="radio" name="slide_switch" id="id2" checked="checked"/>
                <label for="id2">
                    <img src="img/不忘1.jpg" alt="不忘1"/>
                </label>
                <img src="img/不忘1.jpg" alt="不忘1"/>

                <input type="radio" name="slide_switch" id="id3"/>
                <label for="id3">
                    <img src="img/不忘3.png" alt="不忘3"/>
                </label>
                <img src="img/不忘3.png" alt="不忘3"/>
                <input type="radio" name="slide_switch" id="id4"/>
                <label for="id4">
                    <img src="img/不忘4.jpg" alt="不忘4"/>
                </label>
                <img src="img/不忘4.jpg" alt="不忘4"/>

                <input type="radio" name="slide_switch" id="id5"/>
                <label for="id5">
                    <img src="img/入党.jpg" alt="入党"/>
                </label>
                <img src="img/入党.jpg" alt="入党"/>
            </div>
            <div class="buwang-div">
                <ul class="d-flex flex-column">
                    <li>
                        <h6><a href="#">中央红军长征出发纪念馆</a></h6>
                        <p class="text-left">
                            中央红军长征出发纪念馆位于江西省赣州市于都县县城东门，
                            中央红军长征第一渡是中央红军渡过于都河出发长征的八大渡口之一，
                            毛泽东、周恩来、博古等中央领导人及其由中央机关组成的第一、
                            第二野战纵队就是从这里迈出长征第一步的。
                        </p>
                    </li>
                    <hr/>
                    <li>
                        <h6><a href="#">初心使命须臾不能忘</a></h6>
                        <p class="text-left">赣南的红土地上，于都河静静流淌 。
                            85年前，中央红军从这里出发，踏上漫漫征程，引领中国革命的航船穿越急流险滩，
                            铸就一艘驶向中华民族伟大复兴的“中国号”巨轮。</p>
                    </li>
                    <hr/>
                    <li>
                        <h6><a href="#">守初心 担使命 找差距 抓落实</a></h6>
                        <p class="text-left">习近平总书记明确提出，“守初心、担使命，找差距、抓落实”的总要求，
                            是根据新时代党的建设任务、针对党内存在的突出问题、结合这次主题教育的特点提出来的。
                            要深入理解、全面把握这一总要求，切实将其贯穿主题教育全过程。</p>
                    </li>
                    <hr/>
                    <li>
                        <h6><a href="#">不忘初心 牢记使命</a></h6>
                        <p class="text-left">不忘初心、牢记使命，是贯彻党的十九大精神的重要举措。不忘初心、牢记使命，是党保持永远年轻的重要法宝。
                            不忘初心、牢记使命，是党始终铭记历史的重要力量。不忘初心、牢记使命，是党不断开创未来的重要基础。
                        </p>
                    </li>
                    <hr/>
                    <li>
                        <h6><a href="#">入党誓词</a></h6>
                        <p class="text-left">
                            我志愿加入中国共产党，拥护党的纲领，遵守党的章程，履行党员义务，执行党的决定，严守党的纪律，保守党的秘密，对党忠诚，积极工作，为共产主义奋斗终身，随时准备为党和人民牺牲一切，永不叛党。</p>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>
<!--庆八秩芳华图标-->
<div id="xiaoqing" class="row no-gutters">
    <div class="row justify-content-center ico-bg mt-5 mb-5">
        <div class="text-center m-auto">
            <img src="img/党徽.png" alt="党徽" class="ml-5"/>
        </div>
        <div class="text-center m-auto">
            <p class="m-auto" style="width: 300px;text-align:center;font-family: 华文新魏,sans-serif;font-size: 35px;">
                庆八秩芳华
            </p>
        </div>
    </div>
</div>
<!--庆八秩芳华内容-->
<div class="m-auto" style="width: 1200px;">
    <iframe src="brithday.html" style="width: 1200px;height: 600px;"></iframe>
</div>
<!--历史沿革图标-->
<div class="row m-auto bg-danger" style="width: 1200px;height: 50px;">
    <p class="text-center m-auto" style="width: 200px;font-size: 25px;color: #FFFFFF">
        历史沿革
        <img src="img/校庆.jpg" width="50">
    </p>
</div>
<!--历史沿革轮播-->
<div class="row m-auto" style="width: 1200px;">
    <section class="sec1">
        <div class="main">
            <div class="w-newsList w-newsList1 clearfix" id="newsList1">
                <div class="swiper-wrapper">
                    <div class="swiper-slide">
                        <div class="news-item"><a class="clearfix">
                            <div class="news-imgbox img-count">
                                <div class="aspectRatio"></div>
                                <div class="img-count-in"><img src="img/国立中正大学.jpg"></div>
                            </div>
                            <div class="news-text">
                                <div class="date">
                                    <div class="year">1940年</div>
                                </div>
                                <div class="news-h">国立中正大学</div>
                                <div class="news-sum">
                                    江西师范大学的前身是国立中正大学，创办于１９４０年，
                                    首任校长是我国著名植物分类学家、原中央研究院院士胡先骕博士。
                                    中正大学设文、法、理、工、农五个学院１８个系。
                                </div>
                                <div class="more"></div>
                            </div>
                        </a></div>
                    </div>
                    <div class="swiper-slide">
                        <div class="news-item"><a class="clearfix">
                            <div class="news-imgbox img-count">
                                <div class="aspectRatio"></div>
                                <div class="img-count-in"><img src="img/南昌大学.jpg"></div>
                            </div>
                            <div class="news-text">
                                <div class="date">
                                    <div class="year">1949年</div>
                                </div>
                                <div class="news-h">南昌大学</div>
                                <div class="news-sum">全国高等院校进行院系调整，
                                    南昌大学各院系分别调出到中山大学、武汉大学、华中工学院、华南工学院等。以南昌大学师范部为基础，
                                    成立江西师范学院，设中语、历史、艺术、数学、物理、化学、生物７个专修课，后相继改...
                                </div>
                                <div class="more"></div>
                            </div>
                        </a></div>
                    </div>
                    <div class="swiper-slide">
                        <div class="news-item"><a class="clearfix">
                            <div class="news-imgbox img-count">
                                <div class="aspectRatio"></div>
                                <div class="img-count-in"><img src="img/江西师范学院.jpg"></div>
                            </div>
                            <div class="news-text">
                                <div class="date">
                                    <div class="year">1953年</div>
                                </div>
                                <div class="news-h">江西师范学院</div>
                                <div class="news-sum">
                                    全国的高等院校进行院系调整，南昌大学各院系分别调出到中山大学、武汉大学、华中工学院等。以南昌大学师范部为基础，成立江西师范学院，
                                    设中语、历史、艺术、数学、物理、化学、生物７个专修课，后相继改系并增设了一些系。
                                </div>
                                <div class="more"></div>
                            </div>
                        </a></div>
                    </div>
                    <div class="swiper-slide">
                        <div class="news-item">
                            <a class="clearfix">
                            <div class="news-imgbox img-count">
                                <div class="aspectRatio"></div>
                                <div class="img-count-in"><img src="img/江西井冈山大学.jpg"></div>
                            </div>
                            <div class="news-text">
                                <div class="date">
                                    <div class="year">1969年</div>
                                </div>
                                <div class="news-h">江西井冈山大学</div>
                                <div class="news-sum">
                                    １９６９年元月，江西师院被撤销，以师院为主体，加上江西教育学院和江西大学的政教、中文、生物系，
                                    成立井冈山大学，校址设在井冈山拿山。
                                </div>
                                <div class="more"></div>
                            </div>
                        </a></div>
                    </div>
                    <div class="swiper-slide">
                        <div class="news-item"><a class="clearfix">
                            <div class="news-imgbox img-count">
                                <div class="aspectRatio"></div>
                                <div class="img-count-in"><img src="img/江西师范大学.jpg"></div>
                            </div>
                            <div class="news-text">
                                <div class="date">
                                    <div class="year">1983年</div>
                                </div>
                                <div class="news-h">江西师范大学</div>
                                <div class="news-sum">
                                    １９８３年１１月，江西师范学院更名为江西师范大学。
                                </div>
                                <div class="more"></div>
                            </div>
                        </a></div>
                    </div>
                    <div class="swiper-slide">
                        <div class="news-item"><a class="clearfix">
                            <div class="news-imgbox img-count">
                                <div class="aspectRatio"></div>
                                <div class="img-count-in"><img src="img/瑶湖校区.jpg"></div>
                            </div>
                            <div class="news-text">
                                <div class="date">
                                    <div class="year">2002年</div>
                                </div>
                                <div class="news-h">江西师范大学瑶湖校区</div>
                                <div class="news-sum">
                                    ２００３年３月３１日，江西省政府办公厅函复省教育厅，经省政府研究，
                                    同意将江西金融职工大学（江西银行学校）成建制并入江西师范大学。
                                    ２００２年１２月瑶湖校区举行奠基仪式，２００３年９月瑶湖校区第一届新生入...
                                </div>
                                <div class="more"></div>
                            </div>
                        </a></div>
                    </div>
                </div>
                <div class="adSN_page"></div>
                <div class="swiper-num">
                    <span class="active"></span>/
                    <span class="total"></span>
                </div>
            </div>
            <script type="text/javascript">
                $(function () {
                    /*图片位置计算*/
                    var imgCount = function () {
                        $('.img-count').each(function (index, element) {
                            var imgH = $(this).height();
                            var imgW = $(this).width();
                            var $thisimg = $(this).find('img');
                            var img = new Image();
                            img.onload = function () {
                                if ($thisimg.data("img") === false) {
                                    return '';
                                }
                                var imgWidth = img.width;
                                var imgHeight = img.height;
                                if ((imgWidth / imgHeight) < (imgW / imgH)) {
                                    $thisimg.css({
                                        'height': (imgW / imgH) * ((imgHeight * 1.00) / imgWidth) * imgH,
                                        'max-height': (imgW / imgH) * ((imgHeight * 1.00) / imgWidth) * imgH,
                                        'top': -((imgW / imgH) * ((imgHeight * 1.00) / imgWidth) - 1) / 2 * imgH
                                    })
                                } else {
                                    $thisimg.css({
                                        'width': (imgH / imgW) * ((imgWidth * 1.00) / imgHeight) * imgW,
                                        'max-width': (imgH / imgW) * ((imgWidth * 1.00) / imgHeight) * imgW,
                                        'left': -((imgH / imgW) * ((imgWidth * 1.00) / imgHeight) - 1) / 2 * imgW
                                    })
                                }
                            }
                            img.src = $thisimg.attr("src");
                        });
                    }

                    //滚动设置
                    var swiper = new Swiper('#newsList1', {
                        effect: 'fade',
                        fadeEffect: {
                            crossFade: true,
                        },
                        direction: 'horizontal',
                        loop: true,
                        autoplay: {
                            delay: 5000,//滚动速度
                            disableOnInteraction: false,
                        },
                        pagination: {
                            el: '.adSN_page',
                            clickable: true,
                        },
                        on: {
                            init: function () {
                                var total = this.slides.length - 2;
                                $('.swiper-num .total').text('0' + total);
                                this.emit('transitionEnd');
                            },
                            transitionEnd: function () {
                                var index = this.realIndex + 1;
                                $(".swiper-num .active").text("0" + index);
                            }
                        }
                    });

                    imgCount();
                    $(window).resize(function () {
                        imgCount();
                    });
                });
            </script>
        </div>
    </section>
</div>
<!--校园环境图标-->
<div class="row m-auto bg-danger" style="width: 1200px;height: 50px;">
    <p class="text-center m-auto " style="width: 200px;font-size: 25px;color: #FFFFFF">
        校园环境
        <img src="img/校庆.jpg" width="50">
    </p>
</div>
<!--校园环境内容-->
<div class="m-auto  no-gutters" style="width: 1200px;background: #dee2e6">
    <div class="row   justify-content-between m-auto">
        <div class="col-3  m-auto">
            <div class="row">
                <div class="col">
                    <dl>
                        <dt>校名石</dt>
                        <dd>
                            正大门位于学校南面，紫阳大道北侧。学校最大的特点就是没有围墙，只有长达7公里的瑶河围绕校园，充满了人文关怀。简单的花丛环绕八块巨大的石块，上刻“江西师范大学”字样，两旁进出车道、校门和值班室。
                        </dd>
                    </dl>
                </div>
                <div class="col d-flex">
                    <p class="m-auto"><img src="img/石头.jpg" alt="石头" width="100" height="100"></p>
                </div>
            </div>
        </div>
        <div class="col-3  m-auto">
            <div class="row">
                <div class="col">
                    <dl>
                        <dt>校史柱</dt>
                        <dd>
                            校史柱又称校史纪念碑，是江西师范大学标志性建筑之一 。八根石柱雕刻的是江西师范大学历史上的八段历程，它们分别是：壮丽历程、白鹿开先、杏岭肇基、南赣砺志、望城凯旋、青蓝更始、拿山行返、瑶湖弦歌
                        </dd>
                    </dl>
                </div>
                <div class="col d-flex">
                    <p class="m-auto"><img src="img/纪念碑.jpg" alt="纪念碑" width="100" height="100"></p>
                </div>
            </div>
        </div>
        <div class="col-3  m-auto">
            <div class="row">
            <div class="col">
                <dl>
                    <dt>正大坊</dt>
                    <dd>
                        正大坊是江西师范大学瑶湖校区的标志性建筑，近20米高，矗立在正门入口的正大广场。
                        正大坊建在一块四方水池底座上，四根大柱环抱中央一块碑石组成。碑石正面刻有“正大坊”朱砂大字，背面刻有简单介绍。
                    </dd>
                </dl>
            </div>
            <div class="col d-flex">
                <p class="m-auto"><img src="img/正大坊.jpg" alt="正大坊" width="100" height="100"></p>
            </div>
        </div></div>
    </div>
    <div class="row  justify-content-between m-auto">
        <div class="col-3  m-auto">
            <div class="row">
                <div class="col">
                    <dl>
                        <dt>小杏岭公园</dt>
                        <dd>
                            小杏岭公园，是学校唯一一个完整的公园。
                            园内有亭台、楼阁、假山、湖水，绿树成荫、芳草萋萋。湖水和护校河连成一脉，遇到雨水多的季节，水位见涨，映衬湖上九曲桥、石拱桥。
                        </dd>
                    </dl>
                </div>
                <div class="col d-flex">
                    <p class="m-auto"><img src="img/小杏林.jpg" alt="小杏林" width="100" height="100"></p>
                </div>
            </div>
        </div>
        <div class="col-3  m-auto">
            <div class="row">
                <div class="col">
                    <dl>
                        <dt>静湖</dt>
                        <dd>
                            静湖是江西师范大学瑶湖校区最大的人工湖。静湖处于校园的中心位置，傍着庞大的图文信息中心，静湖周围有一圈小路，路旁有许多石凳，湖中养有很多鸭子和天鹅，这里每天清晨都有许多读书人的身影。
                        </dd>
                    </dl>
                </div>
                <div class="col d-flex">
                    <p class="m-auto"><img src="img/静湖.jpg" alt="静湖" width="100" height="100"></p>
                </div>
            </div>
        </div>
        <div class="col-3  m-auto">
            <div class="row">
                <div class="col">
                    <dl>
                        <dt>人民教师雕塑</dt>
                        <dd>
                            “雕塑名为“向往”，采用白色混凝土仿照大理石的分子结构整体浇铸成型。
                            雕塑下半部由层叠的书本渐次变化为人物衣裙，寓意为人民教师是知识的化身”。
                        </dd>
                    </dl>
                </div>
                <div class="col d-flex">
                    <p class="m-auto"><img src="img/雕塑.jpg" alt="雕塑" width="100" height="100"></p>
                </div>
            </div></div>
    </div>
</div>
<!--社会主义核心价值观图标-->
<div class="row m-auto bg-danger" style="width: 1200px;height: 50px;">
    <p class="text-center m-auto " style="width: 300px;font-size: 25px;color: #FFFFFF">
        社会主义核心价值观
        <img src="img/校庆.jpg" width="50">
    </p>
</div>
<!--社会主义核心价值观-->
<div style="width: 1200px;margin: -60px  auto 0 auto;background:#F5F5F5">
    <div class="holderCircle" >
    <div class="dotCircle">
            <span class="itemDot active itemDot1" data-tab="1">
                <i>爱国</i>
                <span class="forActive"></span>
            </span>
        <span class="itemDot itemDot2" data-tab="2">
                <i>公正</i>
                <span class="forActive"></span>
            </span>
        <span class="itemDot itemDot3" data-tab="3">
                <i>平等</i>
                <span class="forActive"></span>
            </span>
        <span class="itemDot itemDot4" data-tab="4">
                <i>诚信</i>
                <span class="forActive"></span>
            </span>
        <span class="itemDot itemDot5" data-tab="5">
                <i>富强</i>
                <span class="forActive"></span>
            </span>
        <span class="itemDot itemDot6" data-tab="6">
                <i>自由</i>
                <span class="forActive"></span>
            </span>
        <span class="itemDot itemDot7" data-tab="7">
                <i>和谐</i>
                <span class="forActive"></span>
            </span>
        <span class="itemDot itemDot8" data-tab="8">
                <i>文明</i>
                <span class="forActive"></span>
            </span>
        <span class="itemDot itemDot9" data-tab="9">
                <i>友善</i>
                <span class="forActive"></span>
            </span>
        <span class="itemDot itemDot10" data-tab="10">
                <i>民主</i>
                <span class="forActive"></span>
            </span>
        <span class="itemDot itemDot11" data-tab="11">
                <i>法治</i>
                <span class="forActive"></span>
            </span>
        <span class="itemDot itemDot12" data-tab="12">
                <i>敬业</i>
                <span class="forActive"></span>
            </span>

    </div>
    <div class="contentCircle">
        <div class="CirItem active CirItem1">
            爱国
        </div>
        <div class="CirItem CirItem2">
            公正
        </div>
        <div class="CirItem CirItem3">
            平等
        </div>
        <div class="CirItem CirItem4">
            诚信
        </div>
        <div class="CirItem CirItem5">
            富强
        </div>
        <div class="CirItem CirItem6">
            自由
        </div>
        <div class="CirItem CirItem7">
            和谐
        </div>
        <div class="CirItem CirItem8">
            文明
        </div>
        <div class="CirItem CirItem9">
            友善
        </div>
        <div class="CirItem CirItem10">
            民主
        </div>
        <div class="CirItem CirItem11">
            法治
        </div>
        <div class="CirItem CirItem12">
            敬业
        </div>
    </div>
</div>
</div>
<script>
    var liitem = document.getElementsByClassName("xuesishinav_a");
    var boxitem = document.getElementsByClassName("xl-box");
    boxitem[0].style.display = "block";
    for (let i = 0; i < liitem.length; i++) {
        (function (i) {
            liitem[i].onmouseover = function () {
                for (var j = 0; j < boxitem.length; j++) {
                    boxitem[j].style.display = "none";
                }
                boxitem[i].style.display = "block";
            }
        })(i)
    }
</script>
<script>

    //    $(".banner").banner($(".banner").find("img"), {
    //       but: false,    // 左右按钮默认为true
    //       butahidden: true,    // 是否自动隐藏左右按钮默认隐藏
    //       list: false,  // 导航按钮
    //       index: 2,    //初始从第几个开始默认为0
    //       autoPlay: true,  // 自动轮播默认为true
    //       delayTiem: 1000,  // 延迟时间默认为2000
    //       moveTime: 500    // 远动时间默认为300
    //    });
    $(".banner1").banner($(".banner1").find("img"), {
        delayTiem: 1500, butahidden: false
    })
</script>
<script>
    //card-container-2
    const cc2=document.getElementById("card-container-2");
    const c4=document.getElementById("holder");

    function fun1() {
        const firstCard = document.getElementById("holder").firstChild;
        cc2.children[2].appendChild(firstCard);
    }

    function fun2() {
        const lastCard = document.getElementById("holder").lastChild;
        cc2.children[2].insertBefore(lastCard,document.getElementById("holder").firstChild);
    }
    const cssLeft = {
            left: '20px',
            opacity: 0
        },
        cssRight = {
            left: '-20px',
            opacity: 0
        },
        cssReset = {
            right: 0,
            left: 0,
            opacity: 1
        };

</script>
</body>
</html>